---
<!-- Copyright © SixtyFPS GmbH <info@slint.dev> ; SPDX-License-Identifier: MIT -->
title: TabWidget
description: TabWidget api.
---

import SlintProperty  from '/src/components/SlintProperty.astro';
import CodeSnippetMD from '/src/components/CodeSnippetMD.astro';

<CodeSnippetMD imagePath="/src/assets/generated/std-widgets-tabwidget.png"  imageWidth="200" imageHeight="200"  imageAlt='std-widgets tabwidget example'>
```slint
import { TabWidget } from "std-widgets.slint";
export component Example inherits Window {
    width: 200px;
    height: 200px;
    TabWidget {
        Tab {
            title: "First";
            Rectangle { background: orange; }
        }
        Tab {
            title: "Second";
            Rectangle { background: pink; }
        }
    }
}
```
</CodeSnippetMD>

`TabWidget` is a container for a set of tabs. It can only have `Tab` elements as children and only one tab will be visible at
a time.

## Properties

### current-index
<SlintProperty typeName="int" propName="current-index" default="0">
The index of the currently visible tab.

```slint "current-index: 1;"
TabWidget {
    current-index: 1;

    Tab {
        title: "First";
    }
    Tab {
        title: "Second";
    }
}
```
</SlintProperty>

## Properties of the `Tab` element

### title
<SlintProperty typeName="string" propName="title">
The text written on the tab.

```slint 'title: "First";'
TabWidget {
    Tab {
        title: "First";
    }
}
```
</SlintProperty>
